<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="../include.jsp" %>

<html>
<head>	
	<script language="JavaScript" type="text/javascript" src="/scripts/custom/common/FoldingFormManager.js"></script>
	<script language="JavaScript" type="text/javascript" src="/scripts/custom/board/BoardCommentAjax.js"></script>
	<script language="JavaScript" type="text/javascript" src="/scripts/custom/board/AttachFileManager.js"></script>
	
	<script type="text/javascript">        
	var $ = jQuery.noConflict();	

	$(document).ready(function() {

		// 뷰 레이아웃 초기화 
		<c:if test="${objBbsInfo.bbsTypeCd == 'NTC'}">
			// NOTICE 타입의 게시판의 경우 리스트보기 기능 없음.
			$("#id_div_article_list_area").hide();
		</c:if>
		<c:if test="${objBbsInfo.bbsTypeCd == 'QNA'}">
			// QNA 타입의 게시판의 경우 이전글,다음글 기능 없음.
			$("#id_div_preview_area").hide();
		</c:if>

	
		// 덧글 확장 토글 초기화
		if (getCookie("id_folding_form_board_comment") == "on") {
			fnFoldingFormToggle("id_folding_form_board_comment", "NO");
			if ($("#id_folding_form_board_comment").hasClass("folding_form_on")) {
				fnLoadComment("${objViewArticle.atcNo}", "${userId}");
			}
		}
		$("#id_folding_toggle_comment").click(function(e) {
			e.preventDefault();
			fnFoldingFormToggle("id_folding_form_board_comment", "NO");
			
			if ($("#id_folding_form_board_comment").hasClass("folding_form_on")) {
				$("#id_folding_toggle_comment_icon").removeClass("open").addClass("close");
				fnLoadComment("${objViewArticle.atcNo}", "${userId}");
			} else {
				$("#id_folding_toggle_comment_icon").removeClass("close").addClass("open");
			}
		});
		
		// 파일사이즈 레이블 초기화
		$(".cssFileSize").each(function(i){
			$(this).html(fnDisplayByte($(this).html()));
		});
		
		
		// 덧글 등록 
		$("#id_btn_comment_add").click(function(e) { 
			e.preventDefault();
			
			var strUserId = "${userId}";
			if (strUserId == "") {
				alert("로그인 후 덧글을 작성 하실 수 있습니다.");
			} else {
				fnSaveComment("${objViewArticle.atcNo}", "${userId}");	
			}
		});
		
		
		// 목록
		$("#id_btn_list").click(function(e) {
			e.preventDefault();
			
			if ($("#id_hid_single_on").val() == "on") {
				location.href = '/board/list/BBS_ID/${objViewArticle.bbsId}?single=on';
			} else {
				location.href = '/board/list/BBS_ID/${objViewArticle.bbsId}';
			}
		});
				
		// 수정
		$("#id_btn_edit").click(function(e) {
			e.preventDefault();
			
			if ($("#id_hid_single_on").val() == "on") {
				location.href = '/board/edit/BBS_ID/${objViewArticle.bbsId}/ATC_NO/${objViewArticle.atcNo}?single=on';
			} else {
				location.href = '/board/edit/BBS_ID/${objViewArticle.bbsId}/ATC_NO/${objViewArticle.atcNo}';
			}
		});

		// 삭제
		$("#id_btn_remove").click(function(e) {
			e.preventDefault();
			
			if (confirm("삭제 하시겠습니까?")) {
				
				if ($("#id_hid_single_on").val() == "on") {
					location.href = '/board/remove/BBS_ID/${objViewArticle.bbsId}/ATC_NO/${objViewArticle.atcNo}?single=on';
				} else {
					location.href = '/board/remove/BBS_ID/${objViewArticle.bbsId}/ATC_NO/${objViewArticle.atcNo}';
				}
			}
		});

		// 답글
		$("#id_btn_reply").click(function(e) {
			e.preventDefault();

			if ($("#id_hid_single_on").val() == "on") {
				location.href = '/board/add/BBS_ID/${objBbsInfo.bbsId}?single=on&atcNo=${objViewArticle.atcNo}';
			} else {
				location.href = '/board/add/BBS_ID/${objBbsInfo.bbsId}?atcNo=${objViewArticle.atcNo}';
			}
		});

		// 등록
		$("#id_btn_add").click(function(e) {
			e.preventDefault();

			if ($("#id_hid_single_on").val() == "on") {
				location.href = '/board/add/BBS_ID/${objBbsInfo.bbsId}?single=on';
			} else {
				location.href = '/board/add/BBS_ID/${objBbsInfo.bbsId}';
			}
		});

		
	});
    </script>
     
    <script type="text/javascript"> 
		function fnViewArticle(e, strAticleNo) {

			if (e.preventDefault) {
				e.preventDefault();
			} else {
				e.returnValue = false;
			}
			
			if ($("#id_hid_board_page").val() != "") {
				if ($("#id_hid_single_on").val() == "on") {
					location.href = '/board/view/BBS_ID/${objBbsInfo.bbsId}/ATC_NO/' + strAticleNo + '?single=on&page=' + $("#id_hid_board_page").val();
				} else {
					location.href = '/board/view/BBS_ID/${objBbsInfo.bbsId}/ATC_NO/' + strAticleNo + '?page=' + $("#id_hid_board_page").val();
				}
			} else {
				location.href = '/board/view/BBS_ID/${objBbsInfo.bbsId}/ATC_NO/' + strAticleNo;
			}
		}
	</script>
</head>
<body>

	<input type="hidden" id="id_hid_single_on" value="${single}" />
	<input type="hidden" id="id_hid_board_page" value="${page}" />
	
	<h3>${objBbsInfo.bbsNm}</h3>

	<b>${objBbsInfo.bbsDesc}</b>
	<br><br>
	
	
		
	<table cellspacing="0" cellpadding="0" border="0" class="input_data2">
		<colgroup>
			<col width="100">
			<col>
			<col width="100">
			<col>
		</colgroup>
		<tr>
			<th><spring:message code="board.label.writer"/></th>
			<td>
				<html:emp empNo="${objViewArticle.regrEmpNo}" type="empNm" />
			</td>
			<th><spring:message code="board.label.write.date"/></th>
			<td>
				<fmt:formatDate value="${objViewArticle.regYmdt}" pattern="yyyy-MM-dd HH:mm:ss" />
			</td>
		</tr>
		<tr>
			<td colspan="4">
				<b>
					<c:if test="${!empty boardCatgList}">[${objViewArticle.subCdCatId}]</c:if>
					${objViewArticle.ttl}
				</b>
			</td>
		</tr>
	</table>

	<table cellspacing="0" cellpadding="0" border="0" width="100%" class="normal_layout">
		<tr>
			<td valign="top">
				<b><spring:message code="board.label.hit"/></b> 
				${objViewArticle.readCnt}
			</td>
			<td style="text-align:right;">
				<c:if test="${!empty objViewArticle.articleFileList}">
					<c:forEach items="${objViewArticle.articleFileList}" var="objFile" varStatus="i">
						<img src="/img/btn_down01.gif"> 
						<a href="/board/file/download/BBS_ID/${objViewArticle.bbsId}/FILE_SEQ/${objFile.fileSeq}">
							${objFile.fileNmReal} [<span class="cssFileSize">${objFile.fileSize}</span>]
						</a>
						<br>
					</c:forEach>
				</c:if>
			</td>
		</tr>
	</table>	
			
	<table cellspacing="0" cellpadding="0" border="0" width="100%" class="normal_layout normal_botton_line">
		<tr>
			<td>${objViewArticle.cont}</td>
		</tr>
	</table>	






	<div style="text-align:right;">
		<c:if test="${boardRoleWrite == 'OK'}">
		
			<c:if test="${userId == objViewArticle.regrEmpNo}">
   			<a href="#" id="id_btn_edit" class="btn_big"><span><spring:message code="button.edit"/></span></a>
			<a href="#" id="id_btn_remove" class="btn_big"><span><spring:message code="button.delete"/></span></a>
			</c:if>
		
		&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
		<a href="#" id="id_btn_reply" class="btn_big"><span><spring:message code="button.reply"/></span></a>
		</c:if>
		
		<a href="#" id="id_btn_list" class="btn_big"><strong><spring:message code="button.list"/></strong></a>
	</div>
	
	
	

			
	<br>
	<br>
	<!-- Folding 기능 버튼 (덧글보기) -->
	<b class="dic_stit"><a href="#" id="id_folding_toggle_comment" class="none_color"><span id="id_folding_toggle_comment_icon" class="open"><spring:message code="board.label.comment.add"/></span></a></b>

	<!-- Folding 기능 검색창 -->
	<div class="tbl_type1">
	<div id="id_folding_form_board_comment" class="folding_form_off">	
		<table id="id_tbl_save_comment" cellspacing="0">
			<col width="70">
			<col>
			<col width="20">
			<tr id="id_loading_comment"> 
				<td colspan="3"><img src="/img/ajax-loader.gif"></td>
			</tr>
			<tr>
				<td style="text-align:left;">
					<c:if test="${!empty userId}"><b><html:emp empNo="${userId}" type="empNm" /></b></c:if>
					<c:if test="${empty userId}"><b>익명</b></c:if>
				</td>
				<td style="text-align:left;" colspan="2">
					<textarea id="id_textarea_comment" style="width:80%;height:40px"></textarea>&nbsp;&nbsp;
					<input type="image" id="id_btn_comment_add" src="/img/btn_memo.gif" >
				</td>
			</tr>
		</table>
	</div>
	</div>
	
				



	<!-- 이전글, 다음글 보기 영역 -->
	<div id="id_div_preview_area">
	<br><br><br>
	<table cellspacing="0" cellpadding="0" border="0" class="prev_data">
		<colgroup>
			<col width="100">
			<col>
			<col width="80">
			<col width="80"> 
		</colgroup>
		
		<c:if test="${!empty objNextArticle}">
		<tr>
			<th><spring:message code="board.label.next.text"/></th>
			<td>
				<a href="#" onClick="fnViewArticle(event, '${objNextArticle.atcNo}')" class="none_color">${objNextArticle.ttl}</a>
			</td>
			<td>
				${objNextArticle.regrEmpNo}
			</td>
			<td>
				<fmt:formatDate value="${objNextArticle.regYmdt}" pattern="yyyy-MM-dd" />
			</td>
		</tr>
		</c:if>
		
		<c:if test="${!empty objPrevArticle}">
		<tr>
			<th><spring:message code="board.label.prev.text"/></th>
			<td>
				<a href="#" onClick="fnViewArticle(event, '${objPrevArticle.atcNo}')" class="none_color">${objPrevArticle.ttl}</a>
			</td>
			<td>
				${objPrevArticle.regrEmpNo}
			</td>
			<td>
				<fmt:formatDate value="${objPrevArticle.regYmdt}" pattern="yyyy-MM-dd" />
			</td>
		</tr>
		</c:if>
	</table>
	</div>






	<!-- 리스트 영역 -->
	<div id="id_div_article_list_area">
	<br><br><br>	
	<!-- [S] 검색 결과 -->
	<div class="tbl_type1">  
	    <table cellspacing="0" summary="표에 관한 요약 정보">  
	    <c:if test="${!empty boardCatgList}"><col width="90"></c:if>
	   	<col>  
	   	<col width="40">
    	<col width="80">  
    	<col width="40">  
    	<col width="80">  
    
	    <thead>
		    <tr>   
		    <c:if test="${!empty boardCatgList}"><th>유형</th></c:if>
		    <th><spring:message code="board.col.title"/></th>
		    <th><spring:message code="board.col.attach"/></th>
		    <th><spring:message code="board.col.writer"/></th>
		    <th>HIT</th>
		    <th><spring:message code="board.col.write.date"/></th>
		    </tr>
	    </thead>  
	
		<c:if test="${!empty objArticleList}">
	    <tbody>  
	    	<div id="id_div_result">
	    	<c:forEach items="${objArticleList}" var="objArticle" varStatus="i">
		    <tr>  
		    	<c:if test="${!empty boardCatgList}"> 
		    	<!-- 유형 -->	
		    	<td>
		    		${objArticle.subCdCatId}
		    	</td>
		    	</c:if>
		    			    
				<!-- 제목 -->				   
			    <td style="text-align:left;">
			    	<c:if test="${objArticle.bbsDepth != 0}">
			    		<c:forEach var="depth" begin="1" end="${objArticle.bbsDepth}" >&nbsp;&nbsp;</c:forEach>
			    		<img src="/img/ico_re.gif">
			    	</c:if>

					<c:choose> 
				    	<c:when test="${!empty objViewArticle}">
				    		<c:if test="${objViewArticle.atcNo == objArticle.atcNo}"><b></c:if>
							<a href="#" onClick="fnViewArticle(event, '${objArticle.atcNo}')" class="none_color">${objArticle.ttl}</a>
				    		<c:if test="${objViewArticle.atcNo == objArticle.atcNo}"></b></c:if>
				    	</c:when>
				    	<c:otherwise>
							<a href="#" onClick="fnViewArticle(event, '${objArticle.atcNo}')" class="none_color">${objArticle.ttl}</a>
				    	</c:otherwise>
				    </c:choose>
				    
			    	<c:if test="${!empty objArticle.articleCommentList}">
						<font color="#A7A7A7">[<c:out value="${fn:length(objArticle.articleCommentList)}"/>]</font>
					</c:if>
			    </td>
			    				    
			    <!-- 첨부 -->
			    <td>
			    	<c:if test="${!empty objArticle.articleFileList}">
			    		<img src="/img/btn_down01.gif">
			    	</c:if>
			    </td>

			    <!-- 작성자 -->
			    <td>
			    	<html:emp empNo="${objArticle.regrEmpNo}" type="empNm" />
			    	<input type="hidden" id="id_reqrEmpNo_${i.count}" value="${objArticle.regrEmpNo}" />
			    </td>  
			    
			    <!-- HIT -->
			    <td>${objArticle.readCnt}</td>
			    
			    <!-- 작성일 -->
			    <td><fmt:formatDate value="${objArticle.regYmdt}" pattern="yyyy-MM-dd" /></td>  
		    </tr>  		
	    	</c:forEach>
	     	</div>	 
	    </tbody>  
	    </c:if>
	
	    </table>  
	</div> 
	<!-- [E] 검색 결과 -->



	<!-- [S] 페이징 결과 -->
	<div style="text-align:center">
		${pageHTML}
	</div>
	<!-- [E] 페이징 결과 -->
	
	
			
	<br><br> 
	<c:if test="${boardRoleWrite == 'OK'}">
	<div style="text-align:center;">
		<a href="#" id="id_btn_add" class="btn_big"><strong><spring:message code="button.registor"/></strong></a>
	</div>	
	</c:if>
	
	
	
</body>
</html>



